Page({
  data: {
    categories: [],
    loading: true,
    error: null
  },

  onLoad() {
    this.fetchCategories();
  },

  // 获取分类列表
  fetchCategories() {
    this.setData({ loading: true, error: null });

    wx.request({
      url: 'https://www.haoyuming.online/api/admin/category/list',
      method: 'GET',
      success: (res) => {
        console.log('分类列表响应：', res.data);
        if (res.data.code === 200) {
          // 处理分类数据，添加图标
          const categoriesWithIcons = res.data.data.map(category => ({
            ...category,
            icon: this.getCategoryIcon(category.name) // 根据分类名称设置对应的图标
          }));
          
          this.setData({
            categories: categoriesWithIcons,
            loading: false
          });
        } else {
          this.setData({
            error: res.data.message || '获取分类失败',
            loading: false
          });
        }
      },
      fail: (err) => {
        console.error('获取分类列表失败：', err);
        this.setData({
          error: '网络错误，请稍后重试',
          loading: false
        });
      }
    });
  },

  // 根据分类名称返回对应的图标
  getCategoryIcon(categoryName) {
    const iconMap = {
      'JavaScript': '📜',
      'Python': '🐍',
      'Java': '☕',
      'Vue': '⚡',
      'React': '⚛️',
      'Node.js': '🟢',
      'Database': '💾',
      'Algorithm': '🔢',
      'Network': '🌐',
      'Security': '🔒',
      'DevOps': '🛠️',
      'Mobile': '📱',
      'Frontend': '🎨',
      'Backend': '⚙️',
      'Other': '📦'
    };
    return iconMap[categoryName] || '📚'; // 默认图标
  },

  // 点击分类项
  onCategoryTap(e) {
    const category = e.currentTarget.dataset.category;
    // 跳转到分类详情页面
    wx.navigateTo({
      url: `/pages/article/article?categoryId=${category.id}&categoryName=${category.name}`
    });
  },

  // 下拉刷新
  onPullDownRefresh() {
    this.fetchCategories();
    wx.stopPullDownRefresh();
  },

  // 返回上一页
  onBackTap() {
    wx.navigateBack({
      delta: 1
    });
  }
});
